<template>
  <address>
    <header>
      <general-button
        @operation="addsopFun"
        btnText="添加"
        btnPowerNum="52BD8DC5-70FD-4B76-BF57-3C2AA9C685EF"
        :btnDisabled="!item.StdOperationID ? true : false"
      ></general-button>
      <general-button
        @operation="allDel"
        btnText="批量删除"
        btnPowerNum="5D21BA7E-35AA-4F2E-B201-B8BFFEEF6764"
        :btnDisabled="!item.StdOperationID ? true : false"
      ></general-button>
    </header>
    <a-table
      :columns="workSetColumns"
      :row-key="(record) => record.JobGroupID"
      :scroll="{ y: workSetScrollY }"
      :data-source="data"
      :loading="loading"
      :pagination="false"
      size="middle"
      :row-selection="{
        selectedRowKeys: rowKeys,
        onChange: changeFun,
      }"
    >
      <template slot="action" slot-scope="text, record">
        <div class="chart-manage">
          <a-icon type="delete" class="icon-class" @click="Del(record)" />
        </div>
      </template>
    </a-table>
  </address>
</template>

<script>
import GeneralButton from "@/components/be-current-btn.vue";
import { delJobOperationRelations } from "@/api/StdOperation/index";
export default {
  components: { GeneralButton },
  props: ["workSetScrollY", "data", "item"],
  data() {
    return {
      workSetColumns: [
        {
          title: "序号",
          dataIndex: "num",
          width: "10%",
          align: "center",
        },
        {
          title: "工作集编码",
          dataIndex: "JobGroupNo",

          width: "40%",
          align: "center",
        },
        {
          title: "工作集名称",
          dataIndex: "JobGroupName",
          width: "40%",
          align: "center",
        },
        {
          title: "工作集版本号",
          dataIndex: "JobTempletVisionOut",
          width: "40%",
          align: "center",
        },
        {
          title: "操作",
          dataIndex: "operate",
          width: "10%",
          align: "center",
          scopedSlots: { customRender: "action" },
        },
      ], //工序关联工作集表头
      loading: false, //表格loading
      rowKeys: [], //表格选中id存储列表
      rowInfoList: [], //表格选中项
      upLoad: false, //是否全局更新
    };
  },
  methods: {
    /* 表格选中id */
    changeFun(selectedRowKeys, selectedRows) {
      this.rowInfoList = selectedRows;
      this.rowKeys = selectedRowKeys; //选中项ID
    },
    //添加方法
    addsopFun() {
      this.$emit("modalFun", {
        show: true,
        data: this.item,
      });
    },
    //确认删除关联工作集
    async confirmDel(data) {
      let res = await delJobOperationRelations(this.upLoad, data);
      this.$message.success("删除成功");
      this.$emit("updata");
    },
    //批量删除
    allDel() {
      let _this = this;
      this.$confirm({
        title: `取消关联【${this.rowInfoList.length}】项`,
        okText: "确认",
        okType: "danger",
        cancelText: "取消",
        onOk() {
          _this.workSetOk(_this.rowInfoList);
        },
        onCancel() {},
      });
    },
    /* 提交工作集关联弹窗 */
    workSetOk(item) {
      let _this = this;
      this.$confirm({
        title: "提示",
        content: `是否全局更新该工序关联的工作集`,
        okText: "是",
        cancelText: "否",
        onOk() {
          _this.upLoad = true;
          _this.confirmDel(item);
        },
        onCancel() {
          _this.upLoad = false;
          _this.confirmDel(item);
        },
      });
    },
    //单项删除
    Del(item) {
      let _this = this;
      this.$confirm({
        title: `取消关联【${item.JobGroupName}】`,
        okText: "确认",
        okType: "danger",
        cancelText: "取消",
        async onOk() {
          _this.workSetOk([item]);
        },
        onCancel() {},
      });
    },
  },
};
</script>

<style lang="less" scoped>
address {
  display: flex;
  flex-direction: column;

  header {
    display: flex;
    justify-content: flex-end;
    margin-bottom: 0.3125rem;

    .ant-btn:nth-child(1) {
      margin-right: 16px;
    }
  }
}
</style>